<template>
	<view class="qk_house_body">
	    <swiper class="qk_house_banner"
	        indicator-dots="false"
	        autoplay="true"
	        interval="3000"
	        indicator-color="rgba(0,0,0,0.2)"
	        indicator-active-color="#fff"
	    >
	        <block v-for="item in bannerImg">
	            <swiper-item>
	                <view class="qk_house_banner_item">
	                <image :src="item">
	                </view>
	            </swiper-item>
	        </block>
	    </swiper>
	    <view class="qk_house_main">
	        <view class="qk_house_title">
	            <view class="qk_house_name">{{name}}</view>
	            <view class="qk_house_tips">
	                <text v-for="item in houseTips">{{item}}</text>
	            </view>
	        </view>
	        <view class="qk_house_detail_info">
	            <view class="qk_house_detail_info_list">
	                <view class="qk_house_detail_info_label">参考价格</view>
	                <view class="qk_house_detail_info_value qk_house_detail_price">{{ckjg}}/套</view>
	            </view>
	            <view class="qk_house_detail_info_list">
	                <view class="qk_house_detail_info_label">建筑面积</view>
	                <view class="qk_house_detail_info_value">约{{jzmj}}m<text class="qk_index_pow">2</text></view>
	            </view>
	            <view class="qk_house_detail_info_list">
	                <view class="qk_house_detail_info_label">户型朝向</view>
	                <view class="qk_house_detail_info_value">{{hxcx}}</view>
	            </view>
	            <view class="qk_house_detail_info_list">
	                <view class="qk_house_detail_info_label">首付预算</view>
	                <view class="qk_house_detail_info_value">{{sfys}}</view>
	            </view>
	            <view class="qk_house_detail_info_list">
	                <view class="qk_house_detail_info_label">户型特色</view>
	                <view class="qk_house_detail_info_value">{{hxts}}</view>
	            </view>
	        </view>
	    </view>
	    <view class="qk_building_toolbar">
	        <button class="qk_building_toolbar_l" open-type="share">
	            <view class="iconfont icon-forward"></view>
	            <view>转发好友</view>
	        </button>
	        <view class="qk_building_toolbar_r" bindtap="callPhone">电话咨询置业顾问</view>
	    </view>
	    <view class="qk_return_btn" bindtap="returnBuildFunc">返回楼盘</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
			  bannerImg:["../images/images/houseImg.png"],
			  houseTips:["户型方正","南北通透"],
			  name:"D户型 3室2厅2卫",
			  ckjg:"102.1~130.9万",
			  jzmj:"122.00",
			  hxcx:"南",
			  sfys:"首付30.64443万，月供3794.89元",
			  hxts:"户型方正、餐客一体厅、干湿分离，居住舒适",
			  phoneNumber:"18959165802"
		  }
		}
	}
</script>

<style>
	.qk_house_body{
	    padding:0 0rpx 400rpx;
	    background-color: #fff;
	}
	.qk_house_banner{
	    height:53.33vw;
	}
	.qk_house_banner_item{
	    height:100%;
	}
	.qk_house_banner_item image{
	    width: 100%;
	    height:100%;
	}
	.qk_house_main{
	    padding: 0 30rpx;
	}
	.qk_house_title{
	    height:170rpx;
	    border-bottom:1px solid #EEEEEE;
	    padding: 60rpx 0 30rpx;
	}
	.qk_house_name{
	    line-height: 70rpx;
	}
	.qk_house_tips text{
	    float: left;
	    height:30rpx;
	    line-height: 30rpx;
	    padding: 0 10rpx;
	    color: #CEBA78;
	    border:1px solid #CEBA78;
	    font-size: 20rpx;
	    background-color: #fff;
	    border-radius: 6rpx;
	}
	.qk_house_tips text+text{
	    margin-left:10rpx;
	}
	.qk_house_detail_info_list{
	    display: flex;
	    line-height: 40rpx;
	    font-size: 26rpx;
	    padding-top: 20rpx;
	}
	.qk_house_detail_info_label{
	    flex: 0 0 155rpx;
	    color: #999;
	}
	.qk_house_detail_info_value{
	    flex: 1;
	    color: #333;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
	}
	.qk_house_detail_price{
	    color: #FF4A19;
	}
</style>
